﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JsPayPage.aspx.cs" Inherits="Shop.TestPay.JsPayPage" %>

<!DOCTYPE html>


<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        body {
            padding: 100px 20px 20px;
            background-color: #fff;
            font-family: 'Microsoft YaHei', sans-serif;
        }

        .main {
            text-align: center;
        }

            .main .m-img {
                width: 40%;
                margin: 1em auto;
            }

                .main .m-img img {
                    max-width: 100%;
                }

            .main .m-title {
                font-size: 20px;
            }

            .main .m-amount {
                font-size: 40px;
            }

        .pay-button {
            display: block;
            margin: 2em auto;
            width: 90%;
            height: 40px;
            border-radius: 5px;
            background-color: #00CD00;
            border: 0px #FE6714 solid;
            cursor: pointer;
            color: white;
            font-size: 16px;
            text-align: center;
            line-height: 40px;
        }

        p {
            position: absolute;
            left: 50%;
            bottom: 10px;
            margin-left: -72px;
            color: #bbb;
            font-size: 12px;
        }
    </style>
    <script type="text/javascript">

        //调用微信JS api 支付
        function jsApiCall()
        {
            //alert('测试在线支付');
            WeixinJSBridge.invoke(
            'getBrandWCPayRequest',
            <%=wxJsApiParam%>,//josn串
                    function (res)
                    {
                        WeixinJSBridge.log(res.err_msg);
                        alert(res.err_code + res.err_desc + res.err_msg);
                        document.getElementById("payDiv").style.visibility="hidden";
                        document.getElementById("paySuc").style.visibility="visible";
                        if(res.err_msg == "get_brand_wcpay_request：ok" ) {
                            // 使用以上方式判断前端返回,微信团队郑重提示：res.err_msg将在用户支付成功后返回    ok，但并不保证它绝对可靠。 
                          
                        }
                    }
                    );
        }
        function callpay()
        {
            if (typeof WeixinJSBridge == "undefined")
            {
                if (document.addEventListener)
                {
                    document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
                }
                else if (document.attachEvent)
                {
                    document.attachEvent('WeixinJSBridgeReady', jsApiCall);
                    document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
                }
            }
            else
            {
                jsApiCall();
            }
        }         
    </script>
</head>
<body>
    <form runat="server">
        <asp:Panel runat="server" id="payDiv">
            <div class="main">
                <div class="m-img">
                    <img src="logo.png">
                </div>
                <div class="m-title">订单金额</div>
                <div class="m-amount">￥<asp:Label ID="amount" runat="server" Text="0.00" /></div>
            </div>
            <asp:Button ID="submit" runat="server" Text="微信支付" OnClientClick="callpay()" class="pay-button" />
            <p>来自王品美厨商城订单支付</p>
        </asp:Panel>

        <asp:Panel runat="server" id="paySuc" Visible="false">
            <div class="main">
                <div class="m-img">
                    <img src="success.png"></div>
                <div class="m-title">订单支付成功</div>
            </div>
            <p>来自王品美厨商城订单支付</p>
        </asp:Panel>
    </form>

    <%--  <br />
        <div align="center">
            <br />
            <br />
            <br />
            <asp:Button ID="submit" runat="server" Text="立即支付" OnClientClick="callpay()" Style="width: 210px; height: 50px; border-radius: 15px; background-color: #00CD00; border: 0px #FE6714 solid; cursor: pointer; color: white; font-size: 16px;" />
        </div>--%>
</body>
</html>
